<template>
    <div style="font-size:0.16rem">
        <ul class="wdddul">
           <li :class="{active:activeli==1}" @click="activeli=1">全部订单</li>
           <li :class="{active:activeli==2}" @click="activeli=2">待付款</li>
           <li :class="{active:activeli==3}" @click="activeli=3">待发货</li>
           <li :class="{active:activeli==4}" @click="activeli=4">待收货</li>
        </ul>
        <div v-if="activeli==1" class="carcontainer">
            <!-- <app-car time="2018-1-1" ddh="565656665654"  cartitle="寂寞双人床" carstyle="绿色"  carprice="1999" carnum="1" isgo="已发货"></app-car> -->
            <div v-if="dd&&dd.length>0">
                <div v-for="i in dd">
                   <app-car  time="2018-1-1" :ddh="i.id" :url="i.pic1" :cartitle="i.name" :carnum="i.count" :carprice="i.price" :isgo="i.recive?'已收货':i.sent?'待收货':i.pay?'待发货':'待付款'"></app-car>
                </div>
            </div>
            <div v-else style="margin-top:2rem;margin-left:3rem">
                暂无数据
            </div>
        </div>
        <div v-if="activeli==2" class="carcontainer">
            <div v-if="dfk&&dfk.length>0">
                <div v-for="i in dfk">
                   <app-car  time="2018-1-1" :ddh="i.id" :url="i.pic1" :cartitle="i.name" :carnum="i.count" :carprice="i.price" :isgo="i.recive?'已收货':i.sent?'待收货':i.pay?'待发货':'待付款'"></app-car>
                </div>
            </div>
            <div v-else style="margin-top:2rem;margin-left:3rem">
                暂无数据
            </div>
        </div>
        <div v-if="activeli==3" class="carcontainer">
            <div v-if="dfh&&dfh.length>0">
                <div v-for="i in dfh">
                   <app-car  time="2018-1-1" :ddh="i.id" :url="i.pic1" :cartitle="i.name" :carnum="i.count" :carprice="i.price" :isgo="i.recive?'已收货':i.sent?'待收货':i.pay?'待发货':'待付款'"></app-car>
                </div>
            </div>
            <div v-else style="margin-top:2rem;margin-left:3rem">
                暂无数据
            </div>
        </div>
        <div v-if="activeli==4" class="carcontainer">
            <div v-if="dsh&&dsh.length>0">
                <div v-for="i in dsh">
                   <app-car  time="2018-1-1" :ddh="i.id" :url="i.pic1" :cartitle="i.name" :carnum="i.count" :carprice="i.price" :isgo="i.recive?'已收货':i.sent?'待收货':i.pay?'待发货':'待付款'"></app-car>
                </div>
            </div>
            <div v-else style="margin-top:2rem;margin-left:3rem">
                暂无数据
            </div>
        </div>
    </div>
</template>
<script>
import Car from './wdddcar';
import {mapGetters,mapActions} from 'vuex';
export default {
    components:{
        'app-car':Car
    },
    data(){
        return {
            dfk:[],
            dfh:[],
            dsh:[],
            dd:[],
            activeli:"1"
        }
    },
    computed: {
        ...mapGetters(['login',"uid"])     //boolean
    },
    created(){
        //全部订单
        this.axios({
            url:`${this.$config.dataUrl}/users/order/${this.uid}`
        }).then(res=>{
            this.dd=res.data.data;
            console.log(this.dd)
            if(res.data.data&&res.data.data.length>0){
                res.data.data.filter(i=>{
                    if((i.recive?'已收货':i.sent?'待收货':i.pay?'待发货':'待付款')=="待付款"){
                        console.log(i,"aaaa")
                        this.dfk.push(i);
                    }else if((i.recive?'已收货':i.sent?'待收货':i.pay?'待发货':'待付款')=="待发货"){
                        this.dfh.push(i);
                    }else if((i.recive?'已收货':i.sent?'待收货':i.pay?'待发货':'待付款')=="待收货"){
                        this.dsh.push(i);
                    }
                });
            }
            console.log(this.dd)
        });
        //代付款
        // this.axios({
        //     url:`http://47.92.98.104/zhaiji/users/order/pay`,
        //     params:{
        //         uid:4,
        //         pay:false
        //     }
        // }).then(res=>{
        //     this.dfk=res.data.data;
        //     console.log(this.dfk,"1111")
        // });
        // //待发货
        // this.axios({
        //     url:`http://47.92.98.104/zhaiji/users/order/sent`,
        //     params:{
        //         uid:7,
        //         sent:false
        //     }
        // }).then(res=>{
        //     if(res.data.data.length>0){
        //         res.data.data.filter(i=>{
        //             if(i.recive?'已收货':i.sent?'待收货':i.pay?'待发货':'待付款'=="待发货"){
        //                 this.dfh.push(i);
        //             }
        //         });
        //     }
        // });
        //  //待收货
        // this.axios({
        //     url:`http://47.92.98.104/zhaiji/users/order/sent`,
        //     params:{
        //         uid:7,
        //         sent:false
        //     }
        // }).then(res=>{
        //     if(res.data.data.length>0){
        //         res.data.data.filter(i=>{
        //             if(i.recive?'已收货':i.sent?'待收货':i.pay?'待发货':'待付款'=="待收货"){
        //                 this.dfh.push(i);
        //             }
        //         });
        //     }
        // });
        
    }
}
</script>
<style lang="css" scoped>
    .wdddul{
        padding:0;
        padding-top:.14rem;
        margin-bottom: 0;
    }
    .wdddul:after{
        content:"";
        display:block;
        clear:both;
        width:0;
        height:0;
    }
    .wdddul li{
        list-style:none;
        float:left;
        width:1.50rem;
        text-align: center;
        line-height:.40rem;
        border-bottom:0.01rem #ccc solid;
		cursor:pointer
    }
    .wdddul li.active{
        border-bottom:0.01rem #b49d7e solid;
    }
    .carcontainer{
        height:4.50rem;
        overflow:auto;
    }
</style>